<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 
    
    (1) 封装一个函数 在数组尾部新增一个或多个元素  push([1,2,3],"a")  => [1,2,3,"a"]
    (2) 封装一个函数 删除数组尾部的元素   pop([1,2,3])  => [1,2]

    (3) 封装一个函数 在数组头部新增一个或多个元素  unshift([1,2,3],"a")  => ["a",1,2,3]
    (4) 封装一个函数 删除数组头部的元素   shift([1,2,3])  => [2,3]

    (5) 封装一个函数 实现数组翻转  reverse([1,2,3,4,5,6,7]) => [7,6,5,4,3,2,1]
    (6) 封装一个函数 用特定的字符将数组拼接形成字符串   join(["a","b","c","d"],"-") => "a-b-c-d"
    -->
</body>
<script>
    // 函数封装步骤
    // 1. 实现基本功能的代码
    // 2. 封装 => 把特定功能的代码放到函数中,起一个函数名
    // 3. 提形参 => 把可变参数改为形式参数
    // 4. 确定返回值 => 由用户自行绝对返回值,如果不设置返回值 默认返回 undefined
    // 5. 调用函数 
</script>
<script>
    // (1) 封装一个函数 在数组尾部新增一个或多个元素  push([1,2,3],"a")  => [1,2,3,"a"]

    // var arr = [1, 2, 3];
    // var char = "a";
    // arr[arr.length] = char;


    // function push(arr, char) {
    //     // var arr = [1, 2, 3];
    //     // var char = "a";
    //     arr[arr.length] = char;
    //     return arr;
    // }

    // function push() {
    //     // arguments:  [[1, 2, 3], 4, 5, 6]   => 二维数组(使用技巧:变相转为一维)
    //     var arr = arguments[0];

    //     for (var i = 1; i < arguments.length; i++) {
    //         var char = arguments[i];
    //         arr[arr.length] = char;
    //     }
    //     return arr;
    // }

    // var result = push([1, 2, 3], 4, 5, 6);
    // console.log(result);


    // (2) 封装一个函数 删除数组尾部的元素   pop([1, 2, 3])  => [1, 2]

    // var arr = [1, 2, 3];
    // arr.length--;
    // console.log(arr);

    // function pop(arr) {
    //     // var arr = [1, 2, 3];
    //     arr.length--;
    //     // console.log(arr);
    //     return arr;
    // }

    // var result = pop([1, 2, 3]);
    // console.log(result);

    //  (3) 封装一个函数 在数组头部新增一个或多个元素  unshift([1,2,3],"a")  => ["a",1,2,3]

    // [1, 2, 3]
    // ["a", 1, 2, 3]
    // ["a", "b", 1, 2, 3]

    // var arr = [1, 2, 3];
    // var char = "a";

    // var len = arr.length - 1;  //下标的最大值 = length - 1
    // for (var i = len; i >= 0; i--) {
    //     // arr[i]
    //     // arr[i+1]
    //     arr[i + 1] = arr[i];
    // }

    // arr[0] = char;
    // console.log(arr);


    // function unshift(arr, char) {
    //     // var arr = [1, 2, 3];
    //     // var char = "a";

    //     var len = arr.length - 1;  //下标的最大值 = length - 1
    //     for (var i = len; i >= 0; i--) {
    //         // arr[i]
    //         // arr[i+1]
    //         arr[i + 1] = arr[i];
    //     }

    //     arr[0] = char;
    //     // console.log(arr);
    //     return arr;
    // }
    // console.log(unshift([1, 2, 3], "a"));


    /* function unshift() {
        // debugger;
        // arguments:  [[1, 2, 3], "a", "b", "c")]
        var arr = arguments[0]; // [1, 2, 3]

        // 倒着遍历的起始下标
        var len = arr.length - 1;  //  下标的最大值 = length - 1
        for (var i = len; i >= 0; i--) {
            // arr[i]
            // arr[i+1]
            arr[i + (arguments.length - 1)] = arr[i];
        }
        // [1, 2, 3, 1, 2, 3]

        for (var j = 1; j < arguments.length; j++) { // 1 2 3
            arr[j - 1] = arguments[j];
        }
        // ["a", "b", "c", 1, 2, 3]

        // console.log(arr);
        return arr;
    }

    console.log(unshift([1, 2, 3], "a", "b", "c")); */



    // (4) 封装一个函数 删除数组头部的元素   shift([1, 2, 3])  => [2, 3]

    // [1, 2, 3]
    // [2, 3]

    // var arr = [1, 2, 3];

    // for (var i = 1; i < arr.length; i++) {
    //     // arr[i]   当前位置
    //     // arr[i-1] 前一个位置
    //     arr[i - 1] = arr[i];
    // }
    // arr.length--;

    // console.log(arr);


    function shift(arr) {
        // var arr = [1, 2, 3];
        for (var i = 1; i < arr.length; i++) {
            // arr[i]   当前位置
            // arr[i-1] 前一个位置
            arr[i - 1] = arr[i];
        }
        arr.length--;
        // console.log(arr);
        return arr;
    }

    console.log(shift([1, 2, 3, 4]));





</script>

</html>